<template>
    <!--新进客户查询 -->
    <div>
        <div class="white ptop">
            <ui-form v-model="searchForm" label-width="100px" class="query-form">
                <ui-form-item label="客户名称">
                    <ui-input type="text" placeholder="请输入关键字查询" v-model="searchForm.customerName"> </ui-input>
                </ui-form-item>

                <ui-form-item label="客户号">
                    <ui-input type="text" placeholder="请输入关键字查询" v-model="searchForm.customerNo"> </ui-input>
                </ui-form-item>
                <ui-form-item label="客户类型">
                    <ui-input type="text" placeholder="请输入关键字查询" v-model="searchForm.customerNo"> </ui-input>
                </ui-form-item>
            </ui-form>
        </div>
        <div class="white btnBody">
            <ui-button class="primary-btn" @click="searchList(true)" icon="ui-icon-search">查询</ui-button>
            <ui-button class="default-btn" @click="reset" icon="ui-icon-refresh-right">重置</ui-button>
        </div>
        <div class="white tableBod">
            <vx-table :tableData="tableData" :isSelect="false" :columns="columns" @multipleSelection="multipleSelection"
                :buttomGroup="buttomGroup" @openDetails="openDetails"></vx-table>
            <ui-pagination :total="total" :page-size="pageSize" :current-page="currentPage" :layout="layout"
                :page-sizes="pageSizeList" @size-change="handleSizeChange" @current-change="handleCurrentChange">
            </ui-pagination>
        </div>
    </div>
</template>
<script>
import pagination from '@/common/mixin/pagination.js'; // 混入分页
import vxTable from '@/components/vx-table';

export default {
    mixins: [pagination],
    components: {
        vxTable,
    },
    data() {
        return {
            searchForm: {
                customerName: '',
                customerNo: '',
                startDate: '',
                endDate: ''
            },
            layout: "total, sizes, prev, pager, next, jumper", // 分页顺序
            columns: [
            {
                    prop: 'userName',
                    label: '序号',
                    type: 'index',
                    width: '150px',
                    fixed: true,
                },
                {
                    prop: 'userName',
                    label: '业务类型',
                    fixed: true,
                },
                {
                    prop: 'userName',
                    label: '申请时间',
                    fixed: true,
                },
                {
                    prop: 'userName',
                    label: '申请状态',
                    fixed: true,
                },

            ],
            tableData: [{}],
            buttomGroup: [
                { label: '详情', methodsName: 'openDetails' }
            ]
        }
    },
    methods: {
        checkdate() {
            console.log("11");
        },
        openDetails() {
            this.$router.push({
                path: '/agentMatters/examineDetails'
            })
        }
    }
}
</script>
<style lang="scss" scoped>
::v-deep .ui-input__prefix {
    display: none;
}
</style>